<template>
    <van-tabbar
      active-color="#f66"
      inactive-color="#333"
      route>
      <van-tabbar-item to="/home">
        <span>首页</span>
        <template #icon="props">
          <van-icon name="shouye" class-prefix="icon"></van-icon>
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/cate">
        <span>分类</span>
        <template #icon="props">
          <van-icon name="fenlei" class-prefix="icon"></van-icon>
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/cart" :badge="$store.state.cart.items.length || ''">
        <span>购物车</span>
        <template #icon="props">
          <van-icon name="gouwuche" class-prefix="icon"></van-icon>
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/user">
        <span>我的</span>
        <template #icon="props">
          <van-icon name="wode" class-prefix="icon"></van-icon>
        </template>
      </van-tabbar-item>
    </van-tabbar>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>

</style>
